<template>
	<view class="flex-col page">
		<view class="flex-col group_4">
			<view class="flex-col items-start text-wrapper">
				<text class="text_1">更新巡检进度时自动更新主材订装时间</text>
			</view>
			<view class="flex-col">
				<view class="flex-col group_5">
					<view class="justify-between group_6">

						<text class="text_2" @click="goFuture">近期安排</text>
						<!-- <text class="text_2" @click="go('/pages/index/plan/plan?status='+isDisplay)">近期安排</text> -->
						<!-- <text class="text_3" @click="go('/pages/tool/material?status='+isDisplay)">全部规划</text> -->
						<text class="text_3" @click="aboutPlan">全部规划</text>
					</view>
					<view class="section_1">
						<!--*-->
					</view>
				</view>
				<view class="flex-col u-p-b-40">

					<view class="flex-col u-m-t-40  u-m-b-30" v-for="(item,index) in list" :key="index">
						<view class="flex-col group_11">
							<view class="justify-between group_12">
								<view class="flex-row">
									<view class="flex-col items-start text-wrapper_1"><text class="text_4"
											:style="{marginLeft:(index+1)>9?('6rpx'):(' 11rpx')}">{{index+1}}</text>
									</view>
									<text class="text_6">{{item.materialName}}</text>
								</view>
								<image @click.stop="goDetail(item.mobilizationId)"
									src="https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/617a2ca7e4f1450011362b37/62b14c62d02982001153329a/16557867997271064133.png"
									class="image_5" />
							</view>

							<view class="u-flex u-flex-col table-box"
								>
								<view class="odd">
									<view class="u-flex-1 u-flex u-row-center u-col-center ">
										<text class="text_8">最晚下单时间</text>
									</view>
									<u-line direction="col" color="#D9D9D9"></u-line>
									<view class="u-flex-1 u-flex u-row-center u-col-center">
										<text class="text_15">{{item.singleTimeName}}</text>
									</view>
									<u-line direction="col" color="#D9D9D9"></u-line>
									<view class="u-flex-1 u-flex u-row-center u-col-center">
										<text class="text_18">{{item.singleTime}}</text>
									</view>
								</view>

								<view class="even">
									<view class="u-flex-1 u-flex u-row-center u-col-center ">
										<text class="text_8">现场测量时间</text>
									</view>
									<u-line direction="col" color="#D9D9D9"></u-line>
									<view class="u-flex-1 u-flex u-row-center u-col-center">
										<text class="text_15">{{item.measureTimeName}}</text>
									</view>
									<u-line direction="col" color="#D9D9D9"></u-line>
									<view class="u-flex-1 u-flex u-row-center u-col-center">
										<text class="text_18">{{item.measureTime}}</text>
									</view>
								</view>
								<view class="odd" v-show="!item.isOpen">
									<view class="u-flex-1 u-flex u-row-center u-col-center ">
										<text class="text_8">进场安装时间</text>
									</view>
									<u-line direction="col" color="#D9D9D9"></u-line>
									<view class="u-flex-1 u-flex u-row-center u-col-center">
										<text class="text_15">{{item.installTimeName}}</text>
									</view>
									<u-line direction="col" color="#D9D9D9"></u-line>
									<view class="u-flex-1 u-flex u-row-center u-col-center">
										<text class="text_18">{{item.installTime}}</text>
									</view>
								</view>
								<view class="even" v-show="!item.isOpen">
									<view class="u-flex-1 u-flex u-row-center u-col-center ">
										<text class="text_8">订购周期参考</text>
									</view>
									<u-line direction="col" color="#D9D9D9"></u-line>
									<view class="u-flex-2 u-flex u-row-center u-col-center">
										<text class="text_15">{{item.cycle}}天</text>
									</view>
								</view>
								<view class="odd" v-show="!item.isOpen">
									<view class="u-flex-1 u-flex u-row-center u-col-center ">
										<text class="text_8">注意事项(备注）</text>
									</view>
									<u-line direction="col" color="#D9D9D9"></u-line>
									<view class="u-flex-2 u-flex u-row-center u-col-center">
										<text class="text_15">{{item.remarks}}</text>
									</view>
								</view>
							</view>

						</view>
						<view class="group_20 view_8 u-relative"> 
							<view class="line">
							</view>
							<view class="action">
								<view class="u-flex u-row-center u-col-center" v-show="item.isOpen" @click="showClick(index)">
									
									<text class="text_24">展开</text>
									<text>
										<image class="image_7" src="https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/617a2ca7e4f1450011362b37/62b14c62d02982001153329a/16557868056751926228.png" mode=""></image>
									</text>
								</view>
								<view class="u-flex u-row-center u-col-center" v-show="!item.isOpen" @click="showClick(index)">
									<text class="text_24">收起</text>
									<view>
										<image class="image_7" src="https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/617a2ca7e4f1450011362b37/62b14c62d02982001153329a/16557868056565062734.png" mode=""></image>
									</view>
								</view>
								

							</view>

						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		components: {},
		data() {
			return {
				height: [
					164,
					164,
					164,
					164
				],
				list: [],
				family: {},
				isDisplay: 1,


			};
		},
		onLoad(option) {
			if (option.status) {
				this.isDisplay = option.status
			}
		},
		onShow() {
			
			this.$store.dispatch('checkHouse');	 
			this.getFamily()
			this.mymaterial();


		},
		created() {

		},
		methods: {
			showClick(index) {
				this.list[index].isOpen = !this.list[index].isOpen
				this.height[index]=='auto'
			},
			aboutPlan() {
				uni.redirectTo({
					url: '/pages/tool/material?status=' + this.isDisplay
				})
			},
			goFuture() {
				uni.redirectTo({
					url: '/pages/index/plan/plan?status=' + this.isDisplay
				})
			},
			getFamily() {
				this.$http('lhouse.query').then(r => {
					if (r.code == 200) {

					
							this.family = r.data.project;
					

					} 
				});
			},
			goDetail(id) {
				uni.navigateTo({
					url: '/pages/tool/addmaterial?mobilizationId=' + id
				})

			},
			mymaterial() {
				this.$http('check.mymaterialSg', {
					isDisplay: this.isDisplay
				}).then(r => {
					if (r.code == 200) {
						this.list = r.data;
					}

				});;
			},
			open(v, index) {

				if (v == 1) {
					this.$set(this.height, index, '164');
				} else {
					this.$set(this.height, index, 'auto');
				}

			}
		},
	};
</script>

<style scoped lang="scss">
	.table-box {
		margin-top: 20rpx;
		width: 100%;
		border-radius: 10rpx;
		opacity: 1;
		border-left: 2rpx solid #D9D9D9;
		border-right: 2rpx solid #D9D9D9;
	}

	.odd {
		width: 100%;
		height: 80rpx;
		background: rgba(29, 106, 255, 0.0600);
		border-bottom: 1px solid #D9D9D9;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.even {
		display: flex;
		justify-content: center;
		align-items: center;
		width: 100%;
		height: 80rpx;
		background: #FFFFFF;
		border-bottom: 1px solid #D9D9D9;
	}

	.line {
		margin-top: 20rpx;
		width: 100vw;
		height: 2rpx;
		background: #EEEEEE;
		border-radius: 0px 0px 0px 0px;
		opacity: 1;

	}

	.action {
		position: absolute;
		right: 0;
		top: 0rpx;
		right: 26rpx;
	}

	.group_9 {
		padding: 24rpx 0 23rpx;
		position: relative;
	}

	.group_10 {
		position: absolute;
		left: 0;
		right: 0;
		top: 0;
	}

	.group_11 {
		padding: 0 32rpx;
	}

	.divider {
		background-color: #eeeeee;
		height: 1rpx;
	}

	.section_2 {
		background-color: #f5f5f5;
		border-radius: 24rpx;
		height: 48rpx;
		position: absolute;
		left: 602rpx;
		right: 32rpx;
		top: 0;
	}

	.group_20 {
		margin-top: 37rpx;

	}

	.group_12 {
		padding-bottom: 27rpx;
		border-bottom: solid 1rpx #1d6aff;
	}

	.section_6 {
		margin-top: 24rpx;
		padding-left: 32rpx;
		padding-right: 8rpx;
		background-image: url('https://project-user-resource-1256085488.cos.ap-guangzhou.myqcloud.com/617a2ca7e4f1450011362b37/62b14c62d02982001153329a/16557869959480143836.png');
		background-position: 0% 0%;
		background-size: 100% 100%;
		background-repeat: no-repeat;
	}

	.image_7 {

		width: 17rpx;
		height: 10rpx;
	}

	.image_5 {
		align-self: center;
		width: 26rpx;
		height: 26rpx;
	}

	.group_23 {
		margin-left: 40rpx;
		flex-shrink: 0;
		padding: 25rpx 31rpx 34rpx 33rpx;
		border-left: solid 1rpx #d9d9d9;
	}

	.group_24 {
		margin-left: 19rpx;
		flex-shrink: 0;
		padding: 25rpx 0 34rpx;
		width: 221rpx;
		border-left: solid 1rpx #d9d9d9;
	}

	.text-wrapper_1 {
		margin-top: 5rpx;
		flex-shrink: 0;
		padding-top: 5rpx;
		padding-left: 2rpx;
		background-image: url('https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/617a2ca7e4f1450011362b37/62b14c62d02982001153329a/16557868051497130564.png');
		background-size: 100% 100%;
		background-repeat: no-repeat;
		width: 56rpx;
		height: 40rpx;
	}

	.text_34 {
		color: #333333;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_8 {
		color: #333333;
		font-size: 24rpx;


	}

	.text_30 {
		color: #333333;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_24 {
		margin-right: 2.5rpx;
		color: #1d6aff;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';

	}

	.group_14 {
		margin-top: 25rpx;
	}

	.text_6 {
		margin-left: 24rpx;
		margin-bottom: 7rpx;
		color: #1d6aff;
		font-size: 32rpx;
		font-family: '.AppleSystemUIFont';

	}

	.text_10 {
		margin-top: 59rpx;
		color: #333333;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';

	}

	.text_22 {
		margin-top: 59rpx;
		color: #333333;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';

	}

	.text_32 {
		margin-top: 59rpx;
		color: #333333;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';

	}

	.text_4 {
		text-align: center;
		color: #ffffff;
		font-size: 28rpx;
		line-height: 28rpx;
		font-family: '.AppleSystemUIFont';

	}

	.page {
		background-color: #ffffffff;
		width: 100%;
		overflow-y: auto;
		overflow-x: hidden;
		height: 100%;
	}

	.group_4 {
		flex: 1 1 auto;
		overflow-y: auto;
	}

	.text-wrapper {
		padding: 21rpx 0 31rpx;
		background-color: #1d6aff0f;
	}

	.text_1 {
		margin-left: 32rpx;
		color: #1d6aff;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.group_5 {
		padding-left: 148rpx;
		padding-right: 147rpx;
		border-bottom: solid 1rpx #eeeeee;
	}

	.group_7 {
		padding: 30rpx 0 50rpx;
	}

	.group_6 {
		padding: 30rpx 0 25rpx;
	}

	.section_1 {
		margin-right: 32rpx;
		align-self: flex-end;
		background-color: #1d6aff;
		border-radius: 4rpx;
		width: 50rpx;
		height: 8rpx;
	}

	.group_8 {
		padding: 557rpx 0 37rpx;
		position: relative;
	}

	.group_21 {
		padding: 304rpx 0 40rpx;
		position: relative;
	}

	.group_25 {
		padding-bottom: 7rpx;
		overflow: hidden;
	}

	.text_2 {
		color: #666666;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 33rpx;
	}

	.text_3 {
		font-weight: 800;
		color: #333333;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 33rpx;
	}

	.view_43 {
		margin-top: 37rpx;
	}

	.view_8 {
		margin-top: 24rpx;
	}

	.group_27 {
		padding: 304rpx 0 37rpx;
		position: relative;
	}

	.group_29 {
		padding-top: 304rpx;
		position: relative;
	}

	.section_3 {
		margin-top: 24rpx;
		padding-left: 32rpx;
		padding-right: 17rpx;
		background-image: url('https://project-user-resource-1256085488.cos.ap-guangzhou.myqcloud.com/617a2ca7e4f1450011362b37/62b14c62d02982001153329a/16557868671170033768.png');
		background-position: 0% 0%;
		background-size: 100% 100%;
		background-repeat: no-repeat;
	}

	.group_32 {
		margin-top: 25rpx;
		flex: 1 1 auto;
	}

	.view_7 {
		flex-shrink: 0;
	}

	.section_4 {
		margin-left: 33rpx;
		flex-shrink: 0;
		background-color: #d9d9d9;
		width: 1rpx;
		height: 436rpx;
	}

	.group_15 {
		margin-left: 32rpx;
		flex: 1 1 auto;
	}

	.view_16 {
		flex: 1 1 auto;
	}

	.text_57 {
		margin-left: 24rpx;
		margin-bottom: 7rpx;
		color: #1d6aff;
		font-size: 32rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 38rpx;
	}

	.text_58 {
		color: #333333;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_59 {
		margin-top: 59rpx;
		color: #333333;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_60 {
		color: #333333;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_61 {
		margin-top: 59rpx;
		color: #333333;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_63 {
		margin-top: 59rpx;
		color: #333333;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_12 {
		margin-top: 59rpx;
		color: #333333;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_13 {
		margin-top: 59rpx;
		color: #333333;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_14 {
		margin-top: 59rpx;
		color: #333333;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text-wrapper_2 {
		margin-top: 5rpx;
		padding: 4rpx 0 3rpx;
		flex-shrink: 0;
		background-image: url('https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/617a2ca7e4f1450011362b37/62b14c62d02982001153329a/16557868051523850412.png');
		background-size: 100% 100%;
		background-repeat: no-repeat;
		width: 56rpx;
		height: 40rpx;
	}

	.text_56 {
		margin-left: 11rpx;
		color: #ffffff;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 33rpx;
	}

	.text_21 {
		margin-top: 24rpx;
		align-self: center;
		color: #333333;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.view_27 {
		flex: 1 1 auto;
	}

	.view_39 {
		flex: 1 1 auto;
	}

	.group_18 {
		margin-top: 25rpx;
		flex: 1 1 auto;
	}

	.section_5 {
		margin-left: 40rpx;
		flex-shrink: 0;
		background-color: #d9d9d9;
		width: 1rpx;
		height: 262rpx;
	}

	.group_19 {
		margin-left: 28rpx;
		margin-top: 25rpx;
		flex-shrink: 0;
	}

	.text-wrapper_3 {
		margin-top: 5rpx;
		padding-top: 5rpx;
		flex-shrink: 0;
		background-image: url('https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/617a2ca7e4f1450011362b37/62b14c62d02982001153329a/16557868051543690600.png');
		background-size: 100% 100%;
		background-repeat: no-repeat;
		width: 56rpx;
		height: 40rpx;
	}

	.text_15 {
		width: 150rpx;
		color: #333333;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
		overflow: hidden; //超出隐藏
		text-overflow: ellipsis; //显示省略号
		white-space: nowrap; //强制不换行
	}

	.text_16 {
		margin-top: 59rpx;
		color: #333333;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_17 {
		margin-top: 59rpx;
		color: #333333;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_18 {
		color: #333333;
		font-size: 24rpx;


	}

	.text_19 {
		margin-top: 59rpx;
		color: #333333;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_20 {
		margin-left: 4rpx;
		margin-top: 59rpx;
		color: #333333;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}
</style>
